<template>
  <div class="mod-user">
    <avue-crud
      ref="crudRef"
      :page="page"
      :data="dataList"
      :option="tableOption"
      @search-change="onSearch"
      @selection-change="selectionChange"
      @on-load="getDataList"
    >
      <template #pic="scope">
        <span v-if="scope.row.pic" class="avue-crud__img">
          <el-icon><Document /></el-icon>
        </span>
        <span v-else>-</span>
      </template>

      <template #status="scope">
        <el-tag v-if="scope.row.status === 0" type="danger"> 禁用 </el-tag>
        <el-tag v-else> 正常 </el-tag>
      </template>

      <template #menu="scope">
        <!--<el-button
          v-if="isAuth('admin:user:update')"
          type="primary"
          icon="el-icon-edit"
          @click.stop="onAddOrUpdate(scope.row.userId)"
        >
          编辑
        </el-button>

        <el-button
          v-if="isAuth('admin:user:update')"
          type="primary"
          icon="el-icon-edit"
          @click.stop="onSetHigherLevelUid(scope.row)"
        >
          修改推荐人
        </el-button>
        <el-button
          v-if="isAuth('admin:user:update')"
          type="primary"
          icon="el-icon-edit"
          @click.stop="openSetVipLevel(scope.row)"
        >
          修改会员等级
        </el-button>-->
      <el-dropdown>
      <el-button type="primary">
        操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
      </el-button>
      <template #dropdown>
        <el-dropdown-menu>
          <el-dropdown-item><el-button
          v-if="isAuth('admin:user:update')"
          type="text"
          icon="el-icon-edit"
          @click.stop="onAddOrUpdate(scope.row.userId)"
        >
          编辑
        </el-button></el-dropdown-item>
          <el-dropdown-item><el-button
          v-if="isAuth('admin:user:update')"
          type="text"
          icon="el-icon-edit"
          @click.stop="onSetHigherLevelUid(scope.row)"
        >
          修改推荐人(三级分销)
        </el-button></el-dropdown-item>
          <el-dropdown-item> <el-button
          v-if="isAuth('admin:user:update')"
          type="text"
          icon="el-icon-edit"
          @click.stop="openSetVipLevel(scope.row)"
        >
          修改会员等级(三级分销)
        </el-button></el-dropdown-item>
          <el-dropdown-item><el-button
          v-if="isAuth('admin:user:update')"
          type="text"
          icon="el-icon-edit"
          @click.stop="openUserSetSharedUid(scope.row)"
        >
          修改推荐人(一级分销)
        </el-button></el-dropdown-item>
          <el-dropdown-item><el-button
          v-if="isAuth('admin:user:update')"
          type="text"
          icon="el-icon-edit"
          @click.stop="openSetUserLevel(scope.row)"
        >
          修改用户等级(一级分销)
        </el-button></el-dropdown-item>
        </el-dropdown-menu>
      </template>
    </el-dropdown>
      </template>
    </avue-crud>

    <!-- 弹窗, 新增 / 修改 -->
    <add-or-update
      v-if="addOrUpdateVisible"
      ref="addOrUpdateRef"
      @refresh-data-list="getDataList"
    />

    <!--修改推荐人 三级分销功能-->
    <user-set-higher-level-uid
      v-if="userSetHigherLevelUidVisible"
      ref="userSetHigherLevelUidRef"
      @refresh-data-list="getDataList"
    />

    <!--修改会员等级 三级分销功能-->
    <setVipLevel
      v-if="setVipLevelVisible"
      ref="setVipLevelRef"
      @refresh-data-list="getDataList"
    />
    <!--修改推荐人 一级分销功能-->
    <user-set-shared-uid
      v-if="userSetSharedUidVisible"
      ref="userSetSharedUidRef"
      @refresh-data-list="getDataList"
    />
    <!--修改用户等级 一级分销功能-->
    <setUserLevel
      v-if="setUserLevelVisible"
      ref="setUserLevelRef"
      @refresh-data-list="getDataList"
    />
  </div>
</template>

<script setup>
import { isAuth } from "@/utils";
import { tableOption } from "@/crud/user/user.js";
import AddOrUpdate from "./add-or-update.vue";
//三级分销功能
import UserSetHigherLevelUid from "./components/user-set-higher-level-uid.vue";
import setVipLevel from "./components/setVipLevel.vue";
//一级分销功能
import userSetSharedUid from "./components/user-set-shared-uid.vue";
import setUserLevel from "./components/setUserLevel.vue";

const dataList = ref([]);
const dataListLoading = ref(false);
const dataListSelections = ref([]);
const addOrUpdateVisible = ref(false);
const page = reactive({
  total: 0, // 总页数
  currentPage: 1, // 当前页数
  pageSize: 10, // 每页显示多少条
});
/**
 * 获取数据列表
 */
const getDataList = (pageParam, params, done) => {
  dataListLoading.value = true;
  http({
    url: http.adornUrl("/admin/user/page"),
    method: "get",
    params: http.adornParams(
      Object.assign(
        {
          current: pageParam == null ? page.currentPage : pageParam.currentPage,
          size: pageParam == null ? page.pageSize : pageParam.pageSize,
        },
        params
      )
    ),
  }).then(({ data }) => {
    dataList.value = data.records;
    page.total = data.total;
    dataListLoading.value = false;
    if (done) done();
  });
};

const addOrUpdateRef = ref(null);
/**
 * 新增 / 修改
 * @param id
 */
const onAddOrUpdate = (id) => {
  addOrUpdateVisible.value = true;
  nextTick(() => {
    addOrUpdateRef.value?.init(id);
  });
};

/**
 * 条件查询
 */
const onSearch = (params, done) => {
  getDataList(page, params, done);
};

/**
 * 多选变化
 */
const selectionChange = (val) => {
  dataListSelections.value = val;
};

const userSetHigherLevelUidVisible = ref(false);
const userSetHigherLevelUidRef = ref(null);
const onSetHigherLevelUid = (row) => {
  userSetHigherLevelUidVisible.value = true;
  nextTick(() => {
    userSetHigherLevelUidRef.value?.init(row);
  });
};

const setVipLevelVisible = ref(false);
const setVipLevelRef = ref(null);
const openSetVipLevel = (row) => {
  setVipLevelVisible.value = true;
  nextTick(() => {
    setVipLevelRef.value?.init(row);
  });
};

const userSetSharedUidVisible = ref(false);
const userSetSharedUidRef = ref(null);
const openUserSetSharedUid = (row) => {
  userSetSharedUidVisible.value = true;
  nextTick(() => {
    userSetSharedUidRef.value?.init(row);
  });
};

const setUserLevelVisible = ref(false);
const setUserLevelRef = ref(null);
const openSetUserLevel = (row) => {
  setUserLevelVisible.value = true;
  nextTick(() => {
    setUserLevelRef.value?.init(row);
  });
};
</script>
